
<template>
<div>
	<!-- 时间选择器  begin 目前区间只支持日期类型  -->
	<div v-if="condition.ctltype==13" >
		<ab-date placeholder="请选择" type="date" v-model="condition.val"  :ab-format="condition.json" ></ab-date>
	</div>
	<div v-else-if="condition.ctltype==3" >
		<flexbox :gutter="12" >
	      	<flexbox-item >
	      		<ab-date placeholder="请选择较小日期" type="date" v-model="condition.val"  :ab-format="condition.json" ></ab-date>
			</flexbox-item>
	      	<flexbox-item v-if="condition.betweenCondition">
	      		<ab-date placeholder="请选择较大日期" type="date" v-model="condition.betweenCondition.val"  :ab-format="condition.json" ></ab-date>
	      	</flexbox-item>
	   	</flexbox>
	</div>
	<!-- 时间选择器  end -->
	
	<!-- 下拉框,复选框,单选框,json  begin -->
	<div v-else-if="[10,4,6,8].indexOf(condition.ctltype)!=-1" >
		<select class="weui-select" v-model="condition.val" >
			<option value="" selected>请选择</option>
			<option v-for="(k,v) in condition.json" :key="v" :value="v">{{ k }}</option>
		</select>
		<span v-if="condition.hasBetween">
			<span class="fl lh34 pl5 pr5">-</span>
			<select class="weui-select" " v-model="condition.betweencondition.val"   ng-options="k as v for (k,v) in condition.json" >
				<option value="">请选择</option>
			</select>
		</span>
	</div>
	
	<!-- 数据字典  begin -->
	<div v-else-if="condition.ctltype==5 || condition.ctltype==7" >
		<select class="weui-select" v-model="condition.val" :disabled="condition.disabled">
			<option value="" selected>请选择</option>
			<option v-for="(k,v) in condition.json" :key="v" :value="v">{{ k }}</option>
		</select>
	</div>
	<!-- 对话框  end -->
	<div v-else-if="condition.ctltype==14" class="miwd80">
		<x-input v-model="condition.text" placeholder="请选择" :readonly="true" v-show="condition.json.dialogKey">
			<ab-cust-dialog class="ivu-btn ivu-btn-primary" :dialog-key="condition.json.dialogKey" 
				:param="condition.json.param || {}"  :dialog-setting="{'multiple':condition.json.multiple|| false}"  @ok="setInputValue"  icon="ios-search" slot="right">{{condition.json.label || '选择'}}</ab-cust-dialog>
		</x-input>
		<span v-show="!condition.json.dialogKey">请参考文档配置搜索控件！</span>
	</div>
	
	<div v-else >
		<x-input v-model="condition.val"  placeholder="请输入" @on-enter="find" autocomplete="off"></x-input>
		<span v-show="condition.betweenCondition"> 目前区间仅支持日期控件</span>
	</div>
</div>
</template>

<script>
import Vue from 'vue';
 
export default {
	props:["condition"],
	data: function () {  
	  return {
	  	scrollerStyle:{},
	  }
	},
	mounted : function(){
		
	},
	methods: {
		setInputValue(arr){
			var name = [];
			var id = [];
			for(var i=0,item;item=arr[i++];){
				name.push(item[this.condition.json.name || "name"])
				id.push(item[this.condition.json.id || "id"])
			}
			
			this.$set(this.condition,"text",name.join(","));
			this.$set(this.condition,"val",id.join(","));
		},
		//上拉刷新
		find(done) {
			 
		},
	},
	watch : {
		url : function(newVal,oldVal){
			 
		}
	}
}

</script>

<style>
 
</style>
